<template>
	<view class="page">
		<view class="title">
			<view>您好，欢迎登录！</view>
		</view>
		<view class="form">
			<view class="inputs">
				<view class="account">
					<input type="text" v-model="account" :adjust-position="false" placeholder="账号" />
				</view>
				<view class="password">
					<input type="password" v-model="password" :adjust-position="false" placeholder="密码" />
				</view>
			</view>
			<view class="button">
				<view @click="register">
					立即登录
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex';
	export default {
		data() {
			return {
				account: "",
				password: "",
				user_id:"",
				store_id:"",
				isLogin: false,
				isInfo: false,
				userInfo: {},
				loginRes: {},
			};
		},
		onLoad() {
			// 页面加载时，检查是否有存储的账号和密码
			const storedAccount = uni.getStorageSync('account');
			const storedPassword = uni.getStorageSync('password');

			if (storedAccount && storedPassword) {
				// 如果有存储的账号密码，自动填充并执行自动登录
				this.account = storedAccount;
				this.password = storedPassword;
				this.autoLogin();  // 调用自动登录方法
			}
		},
		methods: {
			// 自动登录方法
			autoLogin() {
				this.$api.post({
					url: '/User/Login',
					data: {
						account: this.account,
						password: this.password,
					},
					success: res => {
						console.log('自动登录成功:', res);
						this.userInfo = res.userInfo;
						this.isLogin = true;
						this.isInfo = res.userInfo.is_info;

						
						

						// 更新用户登录状态到 Vuex
						this.$store.dispatch('user/login', res);

						// 根据 store_id 判断跳转
						if (res.userInfo.store_id > 0) {
							this.store_id = res.userInfo.store_id
							console.log("resuser:" + res.userInfo.store_id);
							// 保存账号和密码到本地存储
							uni.setStorageSync('account', this.account);
							uni.setStorageSync('password', this.password);
							uni.setStorageSync('store_id',this.store_id );
							uni.navigateTo({
								url: '/pages/bigscreen/hall?store_id=' + res.userInfo.store_id
							});
						} else {
							uni.showModal({
								title: '不是管理员'
							});
						}
					},
					fail: err => {
						uni.showToast({
							title: '自动登录失败，请检查账号密码',
							icon: 'none'
						});
					}
				});
			},
			// 用户点击立即登录按钮
			register() {
				this.$api.post({
					url: '/User/Login',
					data: {
						account: this.account,
						password: this.password
					},
					success: res => {
						console.log('登录成功:', res);
						this.userInfo = res.userInfo;
						this.isLogin = true;
						this.isInfo = res.userInfo.is_info;
						this.store_id = res.userInfo.store_id

						// 保存账号和密码到本地存储
						uni.setStorageSync('account', this.account);
						uni.setStorageSync('password', this.password);
						uni.setStorageSync('store_id',this.store_id );

						// 更新用户登录状态到 Vuex
						this.$store.dispatch('user/login', res);

						// 根据 store_id 判断跳转
						if (res.userInfo.store_id > 0) {
							uni.navigateTo({
								url: '/pages/bigscreen/hall?store_id=' + res.userInfo.store_id
							});
						} else {
							uni.showModal({
								title: '不是管理员'
							});
						}
					},
					fail: err => {
						uni.showToast({
							title: '登录失败，请检查账号密码',
							icon: 'none'
						});
					}
				});
			},
			toLogin() {
				uni.redirectTo({
					url: "./login"
				});
			},
			pactChange() {
				this.pactChecked = !this.pactChecked;
			}
		}
	};
</script>



<style lang="scss" scoped>
	.page {
		min-height: 100vh;
		display: flex;
		flex-direction: column;
		justify-content: space-between;

		.title {
			padding-top: 500rpx;
			padding-bottom: 120rpx;
			background: url("../../static/login-C/pageBg.png") no-repeat top center;
			background-size: 100%;

			view {
				padding-left: 64rpx;
				font-size: 44rpx;
				font-weight: 700;
				line-height: 1;
			}
		}

		.form {
			flex: 1;
			padding: 0 64rpx;

			.inputs {
				margin-bottom: 132rpx;

				view {
					height: 96rpx;
					border-radius: 48rpx;
					border: 1rpx solid rgba(204, 204, 204, 1);
					padding: 0 48rpx;
					display: flex;
					align-items: center;

					input {
						flex: 1;
					}
				}

				.account {
					margin-bottom: 48rpx;
				}

				.vcode {
					text {
						text-wrap: nowrap;
						font-size: 26rpx;
					}
				}
			}

			.button {
				view {
					line-height: 96rpx;
					border-radius: 48rpx;
					text-align: center;
					font-size: 32rpx;
					background: linear-gradient(90deg, rgba(255, 222, 102, 1) 0%, rgba(202, 245, 253, 1) 100%);
				}
			}

			.tip {
				font-size: 28rpx;
				text-align: center;
				margin-top: 30rpx;
			}
		}

		.pact {
			display: flex;
			align-items: center;
			justify-content: center;
			padding-bottom: 70rpx;
			font-size: 24rpx;

			text {
				color: #ffde66;
			}

			checkbox {
				:deep(.uni-checkbox-input) {
					border: 1rpx solid #000000;
				}

				transform:scale(0.6)
			}
		}
	}
</style>